<template>
<div>
  <div v-if="datalist.length>0">
    <div class="mb-2" v-for="(list, index) in datalist" :key="index">
      <div class="p-1">
        <span>订单号：{{list.order_sn}}</span>
      </div>
      <van-card
        :num="item.goods_number"
        :price="item.price"
        :title="item.title"
        :desc="item.description"
        :thumb="item.image[0]"
        v-for="(item, idx) in list.goods"
        :key="idx"
        class="cardBD"
        title-class="cardTIT"
      />
    </div>
  </div>
  <div class="nodata" v-else>
    <van-row>
      <van-col span="24">
        <van-icon custom-class="notIOCN" class="notIOCNWarp" name="notes-o" />
        <div class="notTXT">暂无数据</div>
      </van-col>
    </van-row>
  </div>
</div>
</template>
<script>
import {integral, views} from '../../utils/utils.js'
export default {
  onShareAppMessage (res) {
    if (res.from === 'button') {
      // 增加积分
      this.sharpePage(this.$root.$mp.query.id, 3)
    } else {
      this.sharpePage(this.$root.$mp.query.id, 4)
    }
    return {
      title: '我的礼品',
      imageUrl: '/images/a.png',
      path: '/pages/home/main'
    }
  },
  onReachBottom () {
    let page = this.page + 1
    this.getList(page, this.pagesize)
  },
  data () {
    return {
      datalist: [], // 我的商品列表
      order_status: 1,
      allSelect: false,
      page: 1,
      pagesize: 5,
      imageUrl: 'https://m.360buyimg.com/mobilecms/jfs/t1/2101/33/10155/60913/5bc9a621Eb6adc4a3/228fbc21944661b5.jpg',
      imgBt: 'https://m.360buyimg.com/mobilecms/jfs/t1/7676/6/247/147974/5bc9a5abE7d09e27e/e682db2b16559c3f.jpg',
      imgBt3: 'https://m.360buyimg.com/mobilecms/jfs/t1/2101/33/10155/60913/5bc9a621Eb6adc4a3/228fbc21944661b5.jpg'
    }
  },
  components: {
  },
  methods: {
    onChange (value) {
      this.allSelect = !this.allSelect
    },
    toggle (event) {
      const { name } = event.currentTarget.dataset
      const checkbox = this.selectComponent(`.checkboxes-${name}`)
      checkbox.toggle()
    },
    // 积分增加， 更新 分享、浏览 、转发数量，增加积分
    // type:share 更新分享数   views  更新浏览数 forwarding 更新转发数
    getIntegral (type = 2) {
      let _this = this
      let id = _this.$root.$mp.query.id
      // 增加积分
      integral(id, type)
      // 增加统计数量  views
      views(id, 'views')
    },
    // 1.签到 2.阅读文章 3.转发文章 4.分享小程序
    sharpePage (id, type = 3) {
      // 增加积分
      integral(id, type)
      // 增加统计数量 share
      views(id, 'share')
    },
    getList (page = this.page, pagesize = this.pagesize) {
      let _this = this
      let userDtr = wx.getStorageSync('userDtr')
      wx.request({
        url: _this.apiUrl + 'api/user/getorder?uid_str=' + userDtr + '&order_status=' + this.order_status + '&page=' + page + '&pagesize=' + pagesize,
        success (res) {
          let data = res.data
          if (data.code === 200) {
            wx.stopPullDownRefresh()
            if (page > 1) {
              // 数据追加
              _this.datalist.push(...data.data)
              _this.page = _this.page + 1
            } else {
              _this.datalist = data.data
            }
          }
        }
      })
    }
  },
  mounted () {
    this.getList()
  },
  created () {}
}
</script>
<style>
.barTools {
    color: #fff;
    background-color: #07c160;
    border: 1px solid #07c160;
}
.ck_box {
  margin:0 15px;
  display:inline-block;
}
.bar__text {
  font-weight: 700;
  text-align: right;
  color: #07c160;
  padding-right: 12px;
  margin-left: 15px;
}
.bar__price {
  display: inline-block;
}
.cardTIT.van-card__title {
  font-size:17px;
  height:30px;
  font-weight: 500;
  line-height:30px;
  word-wrap:break-word;
  word-break:break-all;
  overflow: hidden;
  text-overflow: ellipsis; display:-webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
}
.cardDesc {
  font-size:16px;
  height:30px;
  line-height:30px;
}
.price-class, .num-class {
  font-size:16px;
}
.bar__price span {
  display: block
}
.cardBD {
  display:block;
  width:100%;
  margin-bottom: 10px;
}
.van-card__bottom {
  margin: 5px 0;
}
.van-card__price, .van-card__desc, .van-card__num {
  font-size:15px;
  word-wrap:break-word;
  word-break:break-all;
  overflow: hidden;
  text-overflow: ellipsis; display:-webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
}
</style>
